<script type="text/javascript" src="__PUBLIC__/js/jquery/jq.bxCarousel.js"></script>

                        	<div class="jqueryTitle mt5">
                            	<span>实现原理</span>
                            </div>
                            <div class="p15">
                            	具体看源代码，不是很复杂!自己把以前定义按钮的图片改成定义按钮的样式了，这样子个人感觉以后好控制
                            </div>
                            
                        	<div class="jqueryTitle mt5">
                            	<span>相关参数</span>
                            </div>
                            <div class="p15">
                            	<table cellpadding="0" cellspacing="0" class="jqueryAttr">
                                	<thead>
                                    	<tr>
                                        	<th>参数名</th>
                                            <th>参数说明</th>
                                        </tr>
                                    </thead>
                                    <tbody>
		<tr>
        	<td>display_num</td>
            <td>元素显示个数，默认4</td>
        </tr>
		<tr>
        	<td>move</td>
            <td>一次移动的元素个数，默认4</td>
        </tr>        
        <tr>
        	<td>speed</td>
            <td>移动速度，默认500</td>
        </tr>
        <tr>
        	<td>margin</td>
            <td>元素之间间距，默认0</td>
        </tr>
        <tr>
        	<td>auto</td>
            <td>是否自动执行，默认false</td>
        </tr>
        <tr>
        	<td>auto_interval</td>
            <td>自动执行时间间隔，默认2000</td>
        </tr>
        <tr>
        	<td>auto_dir</td>
            <td>自动执行开始方向，默认next</td>
        </tr>
        <tr>
        	<td>auto_hover</td>
            <td>是否开启经过事件处理暂停，默认false</td>
        </tr>
        <tr>
        	<td>next_text</td>
            <td>下一个按钮显示文字，默认next</td>
        </tr>
        <tr>
        	<td>next_class</td>
            <td>下一个按钮样式，默认lin_bxCarousel_btnNext</td>
        </tr>
        <tr>
        	<td>prev_text</td>
            <td>上一个按钮显示文字，默认prev</td>
        </tr>
        <tr>
        	<td>prev_class</td>
            <td>上一个按钮样式，默认lin_bxCarousel_btnPre</td>
        </tr>
        <tr>
        	<td>controls</td>
            <td>控制按钮是否显示,默认true</td>
        </tr>                                                                                                        
        </tbody>
                                </table>
                            </div> 
                            <div class="jqueryTitle mt5">
                            	<span>演示效果</span>
                            </div>
                            <div class="p15">
                            	<p class="pt15">前期准备：头部加入jquery-1.7.2.min.jq.bxCarousel.js文件</p>
                            	<div class="pt15"><strong>效果</strong></div>
                                <p>CSS</p>
                                <pre>.lin_bxCarousel{width:600px; height:125px; border:1px solid #CCC; overflow:hidden; margin:0px auto; position:relative;}
.lin_bxCarousel_scrollObj{position:absolute; left:0px; top:0px; z-index:1;}
.lin_bxCarousel_scrollObj li{float:left; width:200px;height:125px; display:inline;}
.lin_bxCarousel_btnPre,.lin_bxCarousel_btnNext{position:absolute; z-index:4; background-color:#EEE; padding:5px; color:#666666; top:45px;}
.lin_bxCarousel_btnNext{right:1px;}
.lin_bxCarousel_btnPre{left:1px;}</pre>
                                <p>js</p>
                                <pre>$('#demo1').bxCarousel({
display_num: 2, 
move:1, 
auto:true,
controls: true,
margin:0,
prev_class: 'lin_bxCarousel_btnPre',
prev_text:'',
next_text:'',
next_class: 'lin_bxCarousel_btnNext',
auto_hover: true
		});</pre>
             <div class="blank10"></div>
			 <div class="lin_bxCarousel">

            	<ul class="lin_bxCarousel_scrollObj"  id="demo1">
                	<li><img src="__PUBLIC__/images/jquery/a.gif"  alt="图片一"/></li>
                    <li><img src="__PUBLIC__/images/jquery/b.gif"  alt="图片二"/></li>
                	<li><img src="__PUBLIC__/images/jquery/a.gif"  alt="图片一"/></li>
                    <li><img src="__PUBLIC__/images/jquery/b.gif"  alt="图片二"/></li>                    
                </ul>
            </div>
                            	                             
                                
                            </div>  
   
                            <div class="clearfix pt40 pb40">
                            	<a href="http://url.cn/Weauwk" title="《{$data.title}》源代码下载" class="jqueryDown" rel="nofollow" target="_blank">《{$data.title}》源代码下载</a>
                            </div>   
                        
 
 <script type="text/javascript">
 $(function(){
		$('#demo1').bxCarousel({
				display_num: 2,//显示个数 
				move:1, //移动数量
				auto:true,//是否自动关闭
				controls: true,//控制按钮是否显示
				margin:0,//间距
				prev_class: 'lin_bxCarousel_btnPre',
				prev_text:'<',
				next_text:'>',
				next_class: 'lin_bxCarousel_btnNext',
				auto_hover: true//控制滚动对象的经过离开效果 
		});
	});
 </script>   
